body,
html {
	width: 100%;
	height: 100%;
	-webkit-font-smoothing: antialiased;
}

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

// 级联选择
.listbox {
	display: flex;
	height: 200px;
	width: 100%;

	.list {
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		overflow: hidden;
		border-top: 1px solid #f00;
		border-bottom: 1px solid #f00;
		background: linear-gradient(to bottom, #FFF, rgba(255, 255, 255, 0));

		ul {
			transition: all 0.2s ease-out 0s;
		}

		li {
			height: 40px;
			font-size: 16px;
			line-height: 40px;
			list-style: none;
			color: #333;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}

		.line {
			position: absolute;
			top: 80px;
			left: 0;
			width: 100%;
			height: 40px;
			border-top: 1px solid #ccc;
			border-bottom: 1px solid #ccc;
		}

		.shadow {
			position: absolute;
			left: 0;
			width: 100%;
			height: 80px;
			z-index: 99;
			pointer-events: none;
		}

		.upshadow {
			top: 0;
			background: linear-gradient(to top, transparent, #fff);
		}

		.downshadow {
			bottom: 0;
			background: linear-gradient(to bottom, transparent, #fff);
		}
	}
}